Mermaid는 글자로 작성한 설명을 도표로 바꿉니다. 순서도와 시퀀스 및 클래스와 상태 도표 및 원형 차트 등을 만들 수 있습니다. 문법은 Mermaid 공식 안내를 참고하세요.
가로 배치는 왼쪽에 코드와 오른쪽에 미리보기를 둡니다. 세로 배치는 아래에 코드와 위에 미리보기를 둡니다. 떠 있는 버튼의 
으로 바꿀 수 있습니다.
코드를 바꾸면 도표가 자동으로 갱신됩니다. 미리보기 오른쪽 아래의 
을 이용하거나 마우스 휠로 확대 비율을 바꾸세요. 왼쪽 버튼을 누른 채 끌면 이동합니다. 코드를 수정해도 확대 비율과 위치는 유지됩니다. 코드와 미리보기 사이 경계를 끌면 영역 크기를 바꿀 수 있습니다.
떠 있는 버튼에서 다음 기능을 사용할 수 있습니다.
코드에 오류가 있으면 안내 영역에 표시됩니다. 오류가 해결되기 전까지 미리보기에는 마지막으로 정상 표시된 도표가 남습니다.
아래 설명은 본문에 나온 이미지 순서에 맞췄습니다. 이미지는 원본을 유지했으므로 영문 메뉴가 보일 수 있습니다. 현재 앱에서는 한국어 메뉴를 사용합니다. 코드와 주소 및 제품 이름은 원래 표기를 따릅니다.
화면에서 사용하는 주요 표현은 다음과 같습니다.